<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>碧蓝外卖管理端</title>
    <link rel="shortcut icon" href="favicon.ico">
    <!-- 引入element-UI样式 -->
    <link rel="stylesheet" href="plugins/element-ui/index.css" />
    <link rel="stylesheet" href="plugins/element-ui/icon/iconfont.css" />
    <!-- 引入CSS -->
    <link rel="stylesheet" href="css/index.css" />
    <link rel="stylesheet" href="css/all.css" />
</head>
<body>
    <div id="app">
        <!-- 侧面 -->
        <div class="sidebar-container">
            <!-- 图标 -->
            <div class="logo">
                <span class="project-title">碧蓝外卖</span>
            </div>
            <!-- 导航选项 -->
            <!-- default-active:当前激活菜单的 index,unique-opened:是否只保持一个子菜单的展开 -->
            <!-- collapse-transition:是否开启折叠动画 -->
            <el-menu class="TypeMenu" :default-active="defAct" :unique-opened="false" :collapse-transition="false"
                     background-color="#343744" text-color="#bfcbd9" active-text-color="#e6a23c">
                <!-- 循环选项 -->
                <el-menu-item v-for="item in menuList" :key="item.id" :index="item.id" @click="menuHandle(item)">
                    <i class="iconfont" :class="item.icon" style="margin-right: 10px;"></i>
                    <span slot="title" style="font-size: 15px">{{item.name}}</span>
                </el-menu-item>
            </el-menu>
        </div>
        <!-- 内容 -->
        <div class="main-container">
            <!-- 内容-顶部 -->
            <div class="navbar">
                <div class="head-title">
                    <span style="font-weight: bold;">{{headTitle}}</span>
                </div>
                <div class="right-menu">
                    <div class="avatar-wrapper">{{ userInfo.name }}</div>
                    <!-- <div class="logout" @click="logout">退出</div> -->
                    <img src="images/btn_close@2x.png" style="height: 30px" class="outLogin" alt="退出" @click="logout()" />
                </div>
                <div style="clear: both"></div>
            </div>
            <!-- 内容-底部 -->
            <div class="app-main" v-loading="loading">
                <!-- html显示在iframe标签其中 -->
                <iframe id="cIframe" class="c_iframe" name="cIframe" :src="iframeUrl" width="100%" height="100%" v-show="!loading">

                </iframe>
            </div>
        </div>
    </div>
</body>
    <!-- 引入VUE组件 -->
    <script src="plugins/vue/vue.js"></script>
    <!-- 引入element-UI组件库 -->
    <script src="plugins/element-ui/index.js"></script>
    <!-- 引入axios -->
    <script src="plugins/axios/axios.min.js"></script>
    <!-- 引入JS -->
    <script src="js/index.js"></script>
</html>